<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <title>待支付页面</title>
    <script>
        $(function(){
            function getQueryParams(variable)
            {
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i=0;i<vars.length;i++) {
                    var pair = vars[i].split("=");
                    if(pair[0] == variable){return pair[1];}
                }
                return(false);
            }
            var time = 10;
            $("#submitOrder").on("click",function () {
                $.ajax({
                    type: "GET",
                    url: "payProcess?id="+getQueryParams("id"),
                }).done(function( msg ) {
                    if(msg == "payFail"){
                        alert("支付失败！")
                    }else if (msg == "paySuccess"){
                        alert("支付成功");
                    }
                });
            })
            var timeInterval = setInterval(function () {
                if(time==0){
                    clearInterval(timeInterval);
                    return;
                }
                time--;
                $("#remainTime").html(time);
            },1000);


        })
    </script>
</head>
<body>
    倒计时：<span id="remainTime">10</span>秒内支付，否则失败
    <button id="submitOrder">支付</button>
</body>
</html>